<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h2>留言列表</h2>
    <input type="text" placeholder="请输入条码数" id="">
    <input type="text" placeholder="请输入条数" id="">
    <button>点击查询</button><br>

    <script>
        let btn = document.querySelector('button')
        let ipt = document.querySelectorAll("input")
        let body = document.querySelector('body')
        btn.onclick = function () {
            if(document.querySelector('table')){
                table.innerHTML=""
            }
            let xhr = new XMLHttpRequest()
            let token = localStorage.getItem('token')
            xhr.open('get', `http://wish.byesame.com/wish?page=${ipt[0].value}&rows=${ipt[1].value}`)
            // xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
            xhr.setRequestHeader('token', token)
            xhr.send()
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    let data = JSON.parse(xhr.responseText)
                    console.log(data);
                    getlist(data.data.list)
                }
            }
        }
        function getlist(data) {
            let table = document.createElement('table')
            let tbody = document.createElement('tbody')
            table.setAttribute('table', '1')
            for (let i in data) {
                let tr = document.createElement('tr')
                let td1 = document.createElement('td')
                let td2 = document.createElement('td')
                let td3 = document.createElement('td')
                td3.setAttribute('data-id', data[i].id)
                td1.innerHTML = data[i].name
                td2.innerHTML = data[i].content
                td3.innerHTML = "删除"
                body.appendChild(table)
                table.appendChild(tbody)
                tbody.appendChild(tr)
                tr.appendChild(td1)
                tr.appendChild(td2)
                tr.appendChild(td3)
                td3.onclick = function () {
                    this.parentNode.remove()
                    // console.log(this.getAttribute('data-id'));
                    let id = this.getAttribute('data-id')
                    removelist(id)
                }
            }
        }
        function removelist(id) {
            // let id = this.getAttribute('data-id')
            // console.log(id);
            let xhr = new XMLHttpRequest()
            let token = localStorage.getItem('token')
            xhr.open('delete', `http://wish.byesame.com/wish`)
            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
            xhr.setRequestHeader('token', token)
            xhr.send(`id=${id}`)
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    let d = JSON.parse(xhr.responseText)
                    console.log(d);
                    if (d.code == 200) {
                        alert('删除成功')
                        
                        
                    }

                }
            }

        }
    </script>
</body>

</html>